<template>
  <div class="app-container">
    <el-form ref="form" :model="room" label-width="80px" >
      <el-row>
        <el-col :span="24">
          <el-form-item label="房屋楼层">
            <el-input v-model="room.layer" placeholder="必填,请填写房屋楼层,必须是数字" onkeyup="this.value=this.value.replace(/\D/g,'')"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="房屋户型">
            <el-select v-model="room.section" placeholder="必填,请选择户型">
              <el-option
                v-for="item in layer"
                :key="item.key"
                :label="item.label"
                :value="item.key">
              </el-option>
            </el-select>
            &nbsp;
            <el-select v-model="room.apartment" placeholder="必填,请选择房屋户型">
              <el-option
                v-for="item in section"
                :key="item.key"
                :label="item.label"
                :value="item.key">
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="建筑面积">
            <el-input-number v-model="room.builtUpArea" :precision="2" :step="0.1" ></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="算费系数">
            <el-input-number v-model="room.feeCoefficient" :precision="2" :step="0.1"></el-input-number>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="24">
          <el-form-item label="备注">
            <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4}"
              placeholder="选填,请填写备注"
              v-model="room.remark">
            </el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "selectThree",
  props:['room'],
  data(){
    return{
      // 户型
      layer:[
        {'key':'1','label':'一室'},
        {'key':'2','label':'二室'},
        {'key':'3','label':'三室'},
        {'key':'4','label':'四室'},
        {'key':'5','label':'五室'},
        {'key':'6','label':'六室'},
        {'key':'7','label':'七室'},
        {'key':'8','label':'八室'},
      ],
      // 厅
      section:[
        {'key':'1','label':'一厅'},
        {'key':'2','label':'二厅'},
        {'key':'3','label':'三厅'},
        {'key':'4','label':'四厅'},
        {'key':'5','label':'五厅'},
        {'key':'6','label':'六厅'},
        {'key':'7','label':'七厅'},
        {'key':'8','label':'八厅'},
      ]
    }
  },
}
</script>

<style scoped>

</style>
